<template>
	<div id="app" :style="{transform: 'scale('+($store.state.sc)+')',top: $store.state.topH + 'px'}" :class="{onlymap:$route.fullPath =='/gdmap'}">
		<router-view class="rv" />
		<lxc-loading :loading="$store.state.load" type="bounce" />
		<!-- type >> bounce/line/semicircle  可选参数 bgColor zIndex-->
	</div>
</template>
<script>
	export default {
		created() {
			this.fun()
			window.addEventListener('resize', () => {
				this.fun()
			});
		},
		methods: {
			fun() {
				this.$store.commit('setsc', innerWidth / 1536)
				this.$store.commit('settoph', (innerHeight - innerWidth / 1536 * 739) / 2)
			}
		}
	}
</script>
<style lang="scss">
	/*去高德地图水印*/
	.amap-logo {
		display: none !important;
	}

	.amap-copyright {
		display: none !important;
	}

	// 引入字体文件
	@import './assets/DIN1451/DIN1451.css';

	* {
		color: white;
		background-size: 100% 100% !important;
		//火狐浏览器滚动条
		scrollbar-width: thin;
		scrollbar-color: #304156 transparent;

		//谷歌浏览器滚动条
		::-webkit-scrollbar-thumb {
			background-color: #304156;
			height: 50rem;
			outline-offset: -2rem;
			outline: 2rem solid #fff;
			-webkit-border-radius: 5rem;
			border: 2rem solid #fff;
		}

		::-webkit-scrollbar {
			// 若要修改,确保两个一起改动且值相同
			width: 11rem;
			height: 11rem;
		}

		//解决上下边距穿透问题  如果影响了弹性布局 请使用.cab来消除
		&::before,
		&::after {
			content: '';
			display: flex;
		}
	}

	html,
	body {
		margin: 0;
		padding: 0;
		overflow: hidden;
		width: 100%;
		height: 100%;
	}

	html {
		font-family: Avenir, Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-align: center;
		//font-size: calc(100vw / 1536); //移动端适配
		font-size: 1px;


		body {
			overflow: auto;
			width: 100%;
			font-size: 16rem;
			cursor: url(./assets/unav_mox.cur), default;
			background: url(assets/bg.jpg) no-repeat;
			background-size: 100% 100%;


			#app {
				position: absolute;
				transform: translate(-50%, -50%);
				transform-origin: left top;
				//填写你的设计稿尺寸
				width: 1536px;
				height: 739px;

				.el-button {
					display: flex;
					align-items: center;

					span {
						display: flex;
						align-items: center;
					}
				}
			}

			.onlymap {
				//地图单页面时消除样式影响
				width: 100% !important;
				height: 100% !important;
				transform: unset !important;
				top: unset !important;
			}
		}
	}
</style>
